<template>
	<view>
		<placeholder :bgColor="'#ffffff'"></placeholder>
		<view class="content">
			<view class=" flex-align title-box">
				<view class="line"></view>
				<text class="title-t">申请信息</text>
			</view>
			<view class="form-item flex-space">
				<text class="form-item-l">申请人姓名：</text>
				<text class="form-item-r">{{detail.name}}</text>
			</view>
			<view class="form-item flex-space">
				<text class="form-item-l">联系电话：</text>
				<text class="form-item-r">{{detail.phone}}</text>
			</view>
			<view class="form-item flex-space">
				<text class="form-item-l">房产地址：</text>
				<text class="form-item-r">{{detail.address}}</text>
			</view>
			<view class="form-item flex-space">
				<text class="form-item-l">申请金额：</text>
				<text class="form-item-r">{{detail.money}}万</text>
			</view>
			<view class="form-item flex-space">
				<text class="form-item-l">申请产品：</text>
				<text class="form-item-r">{{detail.productName}}</text>
			</view>
		</view>

		<!-- 按钮 -->
		<view class="btn flex-space " v-if="detail.status==0">
			<view class="btn-item" @click="followOrder">订单跟进</view>
			<view class="btn-item btn-item-r" @click="giveOrderApply">放弃订单</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: '',
				detail: {},
			}
		},
		onLoad: function(options) {
			this.id = options.id
			if (this.id) {
				this.getDetai();
			}
		},
		methods: {
			//订单跟进
			followOrder() {
				uni.showModal({
					title: '提示',
					content: '确定跟进该订单？',
					success: (res) => {
						if (res.confirm) {
							this.$api.followOrder(this.detail.id).then(res => {
								uni.showToast({
									icon: 'none',
									title: '操作成功',
									success() {
										uni.navigateBack({
											delta: 1,
										})
									}
								})

							})
						}
					}
				})
			},
			//放弃订单
			giveOrderApply() {
				uni.showModal({
					title: '提示',
					content: '确定放弃该订单？',
					success: (res) => {
						if (res.confirm) {
							this.$api.giveOrderApply(this.detail.id).then(res => {
								uni.showToast({
									icon: 'none',
									title: '操作成功',
									success() {
										uni.navigateBack({
											delta: 1,
										})
									}
								})

							})
						}
					}
				})

			},

			//获取详情
			getDetai() {
				this.$api.getQuickAppyDetail(this.id).then(res => {

					this.detail = res.data.data;

				})
			},
		}
	}
</script>

<style scoped>
	page{
		/* background-color: #F8F8F8; */
	}
	.content {
		padding: 0 30rpx;
	}

	.title-box {
		margin-bottom: 40rpx;
	}

	.line {
		width: 8rpx;
		height: 28rpx;
		background: #585CF7;
		border-radius: 4rpx;
		margin-right: 12rpx;
	}

	.title-t {
		font-size: 32rpx;
		font-weight: bold;
		color: #333333;
	}

	.form-item {
		border-bottom: 1px solid #EEEEEE;
		width: 100%;
		height: 110rpx;
	}

	.form-item-l {
		font-size: 30rpx;
		color: #333333;
	}

	.form-item-r {
		font-size: 30rpx;
		font-weight: bold;
		color: #333333;
	}

	.btn {
		position: fixed;
		left: 30rpx;
		right: 30rpx;
		bottom: 60rpx;
	}

	.btn-item {
		width: 330rpx;
		height: 80rpx;
		background: #585CF7;
		border-radius: 40rpx;
		font-size: 32rpx;
		font-weight: 500;
		color: #FFFFFF;
		line-height: 80rpx;
		text-align: center;
	}

	.btn-item-r {
		background: #EEEEFE;
		border: 2rpx solid #585CF7;
		color: #585CF7;
	}
</style>
